<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<th:block th:fragment="hot_category(data)">
  <div class="joe_index__hot">
    <div class="joe_index__title">
      <ul class="joe_index__title-title default">
        <li class="item active" data-type="created">精品分类</li>
      </ul>
      <div class="joe_index__title-notice">
        <a th:href="@{/categories}" target="_blank" rel="noopener noreferrer nofollow"><i class="joe-font joe-icon-application"></i>全部分类</a>
      </div>
    </div>
      <ul class="joe_index__hot-list hotlist">
      <th:block th:each="hot_data : ${data}">
          <th:block th:switch="${hot_data.hot_category_section_type}">
              <th:block th:case="'category'">
                  <li class="item animated fadeIn"
                      th:with="category = ${categoryFinder.getByName(hot_data.data_by_category.category)}">
                      <a class="link" target="_blank" th:href="@{${category.status.permalink}}" th:title="${category.spec.displayName}">
                          <figure class="inner">
                              <img width="100%" height="120" class="image ls-is-cached lazyloaded" th:data-src="@{/assets/img/hot_cover1.jpg}" th:src="${category.spec.cover}" onerror="Joe.errorImg(this)" th:alt="${category.spec.displayName}">
                              <figcaption class="title">[[${category.spec.displayName}]]</figcaption>
                          </figure>
                      </a>
                  </li>
              </th:block>
              <th:block th:case="'custom'">
                  <li class="item animated fadeIn"
                      th:with="custom_data = ${hot_data.data_by_custom}">
                      <a class="link" target="_blank" th:href="${custom_data.hot_custom_url}" th:title="${custom_data.hot_custom_title}">
                          <figure class="inner">
                              <img width="100%" height="120" class="image ls-is-cached lazyloaded" th:data-src="@{/assets/img/hot_cover1.jpg}" th:src="${custom_data.hot_custom_img}" onerror="Joe.errorImg(this)" th:alt="${category.spec.displayName}">
                              <figcaption class="title">[[${custom_data.hot_custom_title}]]</figcaption>
                          </figure>
                      </a>
                  </li>
              </th:block>
      </th:block>
      </th:block>
        </ul>

  </div>
</th:block>
</html>